.controller {
	width: 96%;
	margin: 1%;
	height: 100rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: white;
}



.Search {
	flex: 5;
}

.imglist {
	display: flex;
	justify-content: center;
}

.imglist .main {
	width: 96%;
	margin-left: 1%;
}

.dateStyle {
	height: 80rpx;
	width: 80rpx;
}

.viewStyle {
	height: 80rpx;
	width: 80rpx;
	margin-right: 40rpx;
}

.grid-view {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 10px;
	-webkit-animation: flip-in-hor-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
	animation: flip-in-hor-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.grid-item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.dateCm {
	width: 100%;
	height: 100%;
}

.thumbnail {
	width: 100px;
	height: 100px;
	display: inline-block;
}

.flow-view {
	display: flex;
	flex-wrap: wrap;
	-webkit-animation: flip-in-hor-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
	animation: flip-in-hor-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.flow-item {
	margin: 10px;
	position: relative;
}

.enlarged-image {
	position: fixed;
	top: 25%;
	width: 98%;
	padding: 1%;
	background-color: #000;
}

.bigView {
	background-color: #000;
	height: 100%;
	width: 100%;
}

.delete-popup {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #fff;
	padding: 20px;
	border-radius: 10px;
}

/* ----------------------------------------------
	 * Generated by Animista on 2024-10-25 16:24:0
	 * Licensed under FreeBSD License.
	 * See http://animista.net/license for more info. 
	 * w: http://animista.net, t: @cssanimista
	 * ---------------------------------------------- */
/**
	 * ----------------------------------------
	 * animation flip-in-hor-bottom
	 * ----------------------------------------
	 */
@-webkit-keyframes flip-in-hor-bottom {
	0% {
		-webkit-transform: rotateX(80deg);
		transform: rotateX(80deg);
		opacity: 0;
	}

	100% {
		-webkit-transform: rotateX(0);
		transform: rotateX(0);
		opacity: 1;
	}
}

@keyframes flip-in-hor-bottom {
	0% {
		-webkit-transform: rotateX(80deg);
		transform: rotateX(80deg);
		opacity: 0;
	}

	100% {
		-webkit-transform: rotateX(0);
		transform: rotateX(0);
		opacity: 1;
	}
}